import React, { useState, useEffect } from 'react';
import { Form, Collapse, message } from 'antd';
import { connect } from 'umi';
import Coefficientparameter from './SliderParameter/Coefficientparameter';
import EquipmentParameter from './SliderParameter/EquipmentParameter';
import MaterialQuantityParameter from './SliderParameter/MaterialQuantityParameter';
import IncomePriceParameter from './SliderParameter/IncomePriceParameter';
import CostPriceParameter from './SliderParameter/CostPriceParameter';
import SpecialCostParameter from './SliderParameter/SpecialCostParameter';
import styles from './index.less';
const { Panel } = Collapse;
@connect(({ SensitivityAnalysis }) => ({
  SensitivityAnalysis,
}))
export default class extends React.Component {
  forms = {};
  componentDidMount = () => {
    this.props.init(this);
  };

  getData = async () => {
    const {
      coefficientForm,
      equipmentForm,
      materialQuantityForm,
      incomePriceForm,
      costPriceForm,
      specialCostForm,
    } = this.forms;

    var attr = [
      coefficientForm?.validateFields(),
      equipmentForm?.validateFields(),
      materialQuantityForm?.validateFields(),
      incomePriceForm?.validateFields(),
      costPriceForm?.validateFields(),
      specialCostForm?.validateFields(),
    ];

    var arr = await Promise.all(attr);
    let flag = arr.some(item => item === undefined);
    if (flag) {
      message.error('请将场景模拟器所有参数填写完整');
      return;
    }
    var [
      coefficientFormData,
      equipmentFormData,
      materialQuantityFormData,
      incomePriceFormData,
      costPriceFormData,
      specialCostFormData,
    ] = await Promise.all(attr);

    let obj = {
      coefficientparameter: coefficientFormData, //系数参数
      equipmentParameter: equipmentFormData, //设备参数
      materialQuantityParameter: materialQuantityFormData, //物料量参数
      incomePriceParameter: incomePriceFormData, //收入价格参数
      costPriceParameter: costPriceFormData, //成本价格参数
      specialCostParameter: specialCostFormData, //特殊费用参数
    };
    console.log(obj, 'obj');
  };

  render() {
    const panelData = [
      {
        title: '系数参数',
        content: (
          <Coefficientparameter
            init={form => (this.forms.coefficientForm = form)}
          />
        ),
      },
      {
        title: '设备参数',
        content: (
          <EquipmentParameter
            init={form => (this.forms.equipmentForm = form)}
          />
        ),
      },
      {
        title: '物料量参数',
        content: (
          <MaterialQuantityParameter
            init={form => (this.forms.materialQuantityForm = form)}
          />
        ),
      },
      {
        title: '收入价格参数',
        content: (
          <IncomePriceParameter
            init={form => (this.forms.incomePriceForm = form)}
          />
        ),
      },

      {
        title: '成本价格参数',
        content: (
          <CostPriceParameter
            init={form => (this.forms.costPriceForm = form)}
          />
        ),
      },
      {
        title: '特殊费用参数',
        content: (
          <SpecialCostParameter
            init={form => (this.forms.specialCostForm = form)}
          />
        ),
      },
    ];

    return (
      <div className={styles.container}>
        <div className={styles.collapse}>
          <Collapse
            bordered={false}
            defaultActiveKey={[0]}
            expandIconPosition="end"
            className="site-collapse-custom-collapse"
          >
            {panelData.map((item, index) => (
              <Panel key={index} header={item.title}>
                <p>{item.content}</p>
              </Panel>
            ))}
          </Collapse>
        </div>
      </div>
    );
  }
}
